<form name="settingsForm" class="form-horizontal" ng-submit="$vm.save(settingsForm)" novalidate>

    <section class="content-header">
      <h1>
        UI Settings
      </h1>
    </section>

    <section class="content">
        <div class="row">
            <div class="col-md-6 col-sm-12">
                <div class="box">
                    <div class="box-header">
                        <h3 class="box-title">General configuration</h3>
                    </div>
                    <div class="box-body">

                        <div class="form-group">
                            <label class="col-md-4 control-label">Hide <em>Empty Case</em> button</label>
                            <div class="col-md-8">
                                <div class="checkbox">
                                    <label>
                                      <input name="hideEmptyCaseButton" type="checkbox" ng-model="$vm.configs.hideEmptyCaseButton"> Check this to disallow creating empty cases
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="box">
                    <div class="box-header">
                        <h3 class="box-title">Case section configuration</h3>
                    </div>
                    <div class="box-body">

                        <div class="form-group">
                            <label class="col-md-4 control-label">Case's tag filter operator</label>
                            <div class="col-md-8">
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" ng-model="$vm.configs.useAndForCaseTagsFilter">
                                        Check this to use <strong>AND</strong> instead of <strong>OR</strong> to combine case tags filter values
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-sm-12">

                <div class="box">
                    <div class="box-header">
                        <h3 class="box-title">Alert section configuration</h3>
                    </div>
                    <div class="box-body">

                        <div class="form-group">
                            <label class="col-md-4 control-label">Alert's tag filter operator</label>
                            <div class="col-md-8">
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" ng-model="$vm.configs.useAndForAlertTagsFilter">
                                        Check this to use <strong>AND</strong> instead of <strong>OR</strong> to combine alert tags filter values
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row mt-s">
            <div class="col-sm-12">
                <button class="btn btn-primary pull-right" ng-disabled="settingsForm.$invalid" type="submit">Save</button>
            </div>
        </div>
    </section>


</form>
